<template>
<div class="login">
        <div class="star">
            <img style="left:42%;bottom:50px" src="../assets/skin/star1.svg" alt="">
            <img style="left:150px;bottom:200px" src="../assets/skin/star2.svg" alt="">
            <img style="left:58%;top:120px" src="../assets/skin/star3.svg" alt="">
            <img style="right:200px;bottom:180px" src="../assets/skin/star4.svg" alt="">
            <img style="left:160px;top:60px" src="../assets/skin/star5.svg" alt="">
            <img style="right:140px;top:68px" src="../assets/skin/star1.svg" alt="">
            <img style="left:46%;top:39%" src="../assets/skin/star4.svg" alt="">
        </div>

        <div class="enterprise">
            <div class="logo">
                <img src="../assets/logo.png" alt="">
                <div class="name">神秘商城</div>
            </div>
            <div class="desc">一款开源免费的商城系统</div>
        </div>
        <div class="panel">
            <div class="form">
                <div class="title">用户登录</div>
                <el-input
                    v-model="input_user"
                    class="input-user"
                    placeholder="用户名称"
                    :suffix-icon="User"
                />
                <el-input
                    type="password"
                    v-model="input_password"
                    class="input-password"
                    placeholder="用户密码"
                    :suffix-icon="Lock"
                    @keyup.enter="doLogin"
                />
                <el-button @click="doLogin" type="primary">登录</el-button>
            </div>

        </div>
    </div>
</template>

   
<script setup lang="ts">
import { ref } from 'vue'
import axios from 'axios'
import { ElMessage } from 'element-plus'
import { useRouter } from 'vue-router'
import checkLogin from '../assets/ts/common'

import {  Lock, User } from '@element-plus/icons-vue';
// import { Vue } from 'vue-class-component';
const input_user = ref<string>('')
const input_password = ref<string>('')
const router = useRouter();

// todo 检测登录状态， 已登录直接跳转到 主页
checkLogin( (res:any) => {

    if( !res.code ){
        router.push({path:'/main/home'});
    }
});

const doLogin = () => {

    console.log('go login');
    // let url = process.env.VUE_APP_URL + '/api/login';
    let url = window.VITE_URL + '/admin.user/login';
    let data = {
        name        : input_user.value,
        password    : input_password.value,
    };
    // console.log(url,data)
    axios.post( url, data ).then( res => {

        console.log( res );
        if( res.data.code==0 ){
            // localStorage.setItem('token', res.data.token.plainTextToken);
            localStorage.setItem('token', res.data.token);
            router.push({path:'/main/cms/nav'});
        }else{

            ElMessage( {
                message: res.data.message?res.data.message:'登录失败',
                duration: 1000,
                type: 'error',
            } )
        }

    });
}
</script>